簡介:本課程為Canvas系列課程第二課。通過對《絢麗的倒計(jì)時效果的學(xué)習(xí)》,在大家對Canvas繪圖有一定了解的基礎(chǔ)上,本課程對Canvas的各個圖形接口進(jìn)行了系統(tǒng)詳細(xì)地介紹,并輔以示例,讓同學(xué)徹底掌握Canvas繪圖,隨心所欲在瀏覽器上繪制炫麗效果!
第1章 讓我們繼續(xù)Canvas繪圖之旅
通過《絢麗的倒計(jì)時效果》,相信大家已經(jīng)對Canvas繪圖有了基礎(chǔ)的理解?,F(xiàn)在,讓我們繼續(xù)Canvas之旅吧!
第2章 從線條開始
線條元素雖然簡單,但不可小覷。它是構(gòu)成圖形的基礎(chǔ)元素。本章詳細(xì)介紹了Canvas繪圖中使用線條構(gòu)成基本圖形元素的方法。
第3章 線條的屬性
引入一個更加復(fù)雜的圖形繪制案例——畫一個五角星。并且通過這個案例,詳細(xì)說明Canvas線條屬性的使用。
第4章 星空和圖形變換
拓展五角星的繪制,繪制多個五角星組成一片星空,并且據(jù)此介紹Canvas中圖形變換相關(guān)功能的使用。
第5章 填充樣式
本章詳細(xì)介紹了fillStyle可以使用的所有樣式。除了使用一種顏色以外,還包括使用線性漸變或者徑向漸變進(jìn)行漸變色的填充;使用圖片、畫布或者video視頻進(jìn)行樣式填充。
第6章 曲線的繪制
本章詳細(xì)分析了Canvas繪圖提供的四個曲線繪制函數(shù),使得大家可以在自己的Canvas畫布上任意繪制弧線或者曲線,大大拓展了繪制的靈活性。
第7章 文字的渲染
本章詳細(xì)介紹了在canvas上進(jìn)行文字渲染的方式。學(xué)習(xí)本章后,大家可以圖文并茂地使用Canvas,創(chuàng)建屬于自己的Canvas應(yīng)用。
第8章 Canvas高級內(nèi)容
給自己的繪圖添加陰影;制定全局透明色;制作絢麗的探照燈效果或者剪紙效果;為Canvas繪圖添加交互能力……本章探討了5個不同側(cè)面的高級話題,讓你意識到,Canvas繪圖——只有想不到,沒有做不到!
第9章 Canvas之旅仍在繼續(xù)
Canvas是如此的具有魅力,將web從傳統(tǒng)的文檔顯示帶入了一個全新的境地。Canvas標(biāo)準(zhǔn)一直在更新,同時,我們的Canvas之旅遠(yuǎn)沒結(jié)束。讓我們一起看看,使用Canvas,我們還有可能做出什么。